<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="renderer" content="webkit">
    <title>呼叫云</title>
    <link rel="shortcut icon" href="../img/logox_circle.png">
    <link rel="stylesheet" href="../css/pintuer.css">
    <link rel="stylesheet" href="../css/admin.css">
    <script src="../js/jquery-1.11.0.min.js"></script> 
    <script src="../js/config.js"></script>
    <script src="../js/fenye.js"></script> 
    <script src="../common/laydate/laydate.js"></script> 
	<script>
		$(function(){
			$("#showName").val("role2");
			//总条数
			var counts = ${count};
			//总页数
			var pageCouts = "";
			if(counts % 10 == 0){
				pageCouts =  parseInt(counts/10);
			}else{
				pageCouts =  parseInt(counts/10) + 1;
			}
			pg = new showPages('pg','${page}',pageCouts,counts);
			
			pg.printHtml(2,pageCouts);        //显示页数
			
			showPages.prototype.createUrl = function (page) { //生成页面跳转url
				if (isNaN(parseInt(page))) page = 1;
				if (page < 1) page = 1;
				if (page > this.pageCount) page = this.pageCount;
				var url = location.protocol + '//' + location.host + location.pathname +"?page="+page;
				
				//获取参数
				var roleName = $("#roleName").val();
				if(roleName != ""){
					url = url+"&roleName="+roleName;
				}
				return url;
			}
			
		});
		//获取角色详情
		function getRoleInfo(roleID){
			$.ajax({
				 url:serviceConfig.role.getRoleInfo,
				 type: "get",
		         data:{
		         	roleID:roleID
		         },
		         dataType: "json",
		         success:function(data){
		        	 if(data.flag == '1'){
		        	 	var role = data.role;
		        	 	$("#roleCode1").val(role.code);
		        	 	$("#rolename1").val(role.name);
						$("#remark1").val(role.remark);
						$("#roleID1").val(role.id);
		        	 }
		         },
		         error:function(data){
		        	 console.log(data);
		         }
			});
		}
		//删除
		function deleteRole(roleID,roleName){
			var message="确定要删除"+roleName+"吗？";
			 if(confirm(message)){
			 		$.ajax({
						 url:serviceConfig.role.deleteRole,
						 type: "get",
				         data:{
				         	roleID:roleID
				         },
				         dataType: "json",
				         success:function(data){
				        	 if(data.flag == '1'){
				        	 	alert("删除成功！");
				        	 	window.location.reload();//刷新当前页面.
				        	 }
				         },
				         error:function(data){
				        	 console.log(data);
				         }
					});
	         }
		}
		//获取角色管理权限
		function getRolePrivilegeList(roleID,roleName){
			var url = window.location.search;
			if(url != ""){
				location.href=serviceConfig.role+toRolePrivilegeListPage+"?roleID="+roleID+"&roleName="+roleName+"&url="+escape(url);
			}else{
				location.href=serviceConfig.role.toRolePrivilegeListPage+"?roleID="+roleID+"&roleName="+roleName;
			}
		}
	</script>
</head>

<body>
<div class="lefter">
    <div class="logo"><a href="#" target="_blank"><img style="width:100%;" src="../img/logo3.png" alt="呼叫云后台管理系统" /></a></div>
</div>
<div class="righter nav-navicon" id="admin-nav">
    <div class="mainer">
        <div class="admin-navbar">
            <span class="float-right">
            	<span id="user_name"></span>
                <a class="button button-little bg-yellow" href="login">注销登录</a>
            </span>
            <#include "../common/head.ftl"> 
        </div>
        <div class="admin-bread">
            <ul class="bread">
                <li><a class="icon-user-md"> 权限管理</a></li>
                <li><a >角色管理</a></li>
            </ul>
        </div>
    </div>
</div>
	
<div class="admin">
	<div class="line-big">
		<div class="xm12">
			<form action="getRoleList" method="get">
			<div class="xm1" style="padding:0px;padding-top:10px;text-align:right;"><strong>角色名称：</strong></div>
			<div class="xm1" style="padding:0px;">
				<input type="text" class="input" id="roleName" name="roleName" value="${roleName}"/>
			</div>
			<div class="xm1" style="padding:0px;text-align:center;padding-left:20px;">
				<button class="button bg-main" type="submit">搜索</button>
			</div>
			</form>
			<div style="float:left;">
				<a class="button bg-main" href="#modal" id="addRole">添加</a>
			</div>
		</div>
	</div>
    <div class="panel admin-panel" style="margin-top:20px;">
    	<div class="panel-head"><strong>角色列表</strong></div>
        
        <table class="table table-hover">
        	<tr>
				<th width="40">序号</th>
				<th width="100">角色编码</th>
				<th width="100">角色名称</th>
				<th width="200">备注</th>
				<th width="200">操作</th>
			</tr>
			<#list roleList as roleMap>
				<#if count gt 0 >
				<tr>
					<td>${roleMap_index+1}</td>
						<td>${roleMap.roleCode}</td>
					    <td>${roleMap.roleName}</td>
						<td>${roleMap.remark}</td>
						<td>
							<a class="button border-blue button-little" href="#" id="" onclick="getRolePrivilegeList('${roleMap.roleID}','${roleMap.roleName}')">权限管理</a>
							<a class="button border-blue button-little updateRole" href="#modal1" id="" onclick="getRoleInfo('${roleMap.roleID}')">修改</a>
							<a class="button border-yellow button-little" href="#" onclick="deleteRole('${roleMap.roleID}','${roleMap.roleName}')">删除</a>
						</td>
				</tr>
				</#if>
			</#list>
        </table>
        <div class="panel-foot text-center">
				<#if count gt 0 >
		             <div class="page" id="pages"></div>
		        <#else>
		       <div style="padding-top:30px;"><strong>没有相关数据</strong></div>
				</#if>
        </div>
    </div>
</div>
<div id="modal" class="admin" style="display:none;width:70%;height:70%;border-radius:10px 10px 10px 10px;padding:20px;">
	<#include "addRole.ftl"> 
</div>
<div id="modal1" class="admin" style="display:none;width:70%;height:70%;border-radius:10px 10px 10px 10px;padding:20px;">
	<#include "updateRole.ftl"> 
</div>
</body>
</html>